<script setup lang="ts">

// //{
// "teamName": "拿云开发分享会",
//     "teamDescription": "NAYUN拿云",
//     "teamExpiretime": "2034-01-14",
//     "teamStatus": 0,
//     "teamPassword": ""
// }//
import {ref} from "vue";
import {useRouter} from "vue-router";
import teamAxios from "../plugins/teamAxios";

const router = useRouter();
const initFormData = {
  "teamName": "",
  "teamDescription": "",
  "teamExpiretime": "",
  "teamStatus": "",
  "teamPassword": ""
}
//状态
//日期

const today = new Date(); // 获取当前日期
const tomorrow = new Date(today); // 克隆当前日期
tomorrow.setDate(today.getDate() + 1); // 加上1天
const minDate = new Date(tomorrow);
const result = ref('');
const showPicker = ref(false);
const onConfirm = ({ selectedValues }:{ selectedValues: any[] }) => {
  result.value = selectedValues.join('-');
  showPicker.value = false;
};

//表单
const addTeamData =  ref({...initFormData});
const onSubmit = async () => {
  const postData = {
    ...addTeamData.value,
    teamStatus: Number(addTeamData.value.teamStatus),
    teamExpiretime: result.value
  }

//发送请求

  const res = await teamAxios.post("/add",postData,{ withCredentials: true })
  // @ts-ignore
  if (res?.code === 200 && res.data) {
    console.log("添加成功")
    router.push({
      path: '/team',
      replace: true,
    });
  } else {
    console.log("添加失败")
  }

}

</script>
<template>
  <div>n
    <van-notice-bar
        color="#1989fa"
        background="#ecf9ff"
        style="padding-top: 26px"
        left-icon="volume-o"
        text="友你官方：用户只能最多创建5支队伍，每支队伍10人上限"
    />

    <van-form @submit="onSubmit">
      <van-cell-group inset>
        <van-field
            v-model="addTeamData.teamName"
            name="teamName"
            label="队伍名"
            placeholder="队伍名"
            :rules="[{ required: true, message: '请填写队伍名' }]"
        />
        <van-field
            v-model="addTeamData.teamDescription"
            rows="4"
            autosize
            label="队伍简介"
            type="textarea"
            placeholder="请填写队伍简介（最大100字）"
        />
        <van-field
            v-model="result"
            is-link
            readonly
            name="datePicker"
            label="截止时间"
            placeholder="允许队成员加入的截止时间"
            @click="showPicker = true"
        />
        <van-popup v-model:show="showPicker" position="bottom">
          <van-date-picker @confirm="onConfirm" @cancel="showPicker = false" :min-date="minDate" />
        </van-popup>
        <van-field name="radio" label="队伍状态">
          <template #input>
            <van-radio-group v-model="addTeamData.teamStatus" direction="horizontal">
              <van-radio name="0">公开</van-radio>
              <van-radio name="1">私有</van-radio>
              <van-radio name="2">邀请</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
            v-model="addTeamData.teamPassword"
            v-if="addTeamData.teamStatus==='2'"
            name="teamPassword"
            label="邀请码"
            placeholder="请填写12位邀请码"
            :rules="[{ required: true, message: '请填写12位邀请码' }]"
        />
      </van-cell-group>
      <div style="margin: 16px;">
        <van-button round block type="primary" native-type="submit">
          提交
        </van-button>
      </div>
    </van-form>
  </div>
</template>
<style scoped>

</style>